<!--
 * @Description: 真警情列表
 * @Author: yangxq
 * @Date: 2019-09-10 19:46:10
 * @LastEditTime: 2019-09-16 17:22:30
 * @LastEditors: Please set LastEditors
 -->
<template>
  <div class="alarm_wrap">
    <div class="topNavs">
      <van-nav-bar title="真警历史"
                   left-arrow
                   @click-left="$router.go(-1)" />
    </div>
    <div class="alarm-list">
      <div class="item"
           v-for="(item,index) in list"
           :key="index"
           @click="toAlarmDetail(item.alarmId)">
        <div class="left-block">
          <strong>复核时间</strong>
          <div class="leftCon">{{item.reviewTime}}</div>
        </div>
        <div class="left-block">
          <strong>复核人</strong>
          <div class="leftCon">{{item.reviewUserName}} {{item.reviewUserTel}}</div>

        </div>
        <div class="left-block">
          <strong>地址</strong>
          <div class="leftCon">{{item.deviceAddress}}</div>
        </div>

      </div>
    </div>
  </div>

</template>

<script>

export default {
  name: "alarmList",
  data () {
    return {
      user: "",
      list: [],

    };
  },

  mounted () {
    this.user = JSON.parse(localStorage.getItem("user"));
    this.queryAlarmInfoList();
  },
  methods: {
    //警情列表
    queryAlarmInfoList () {

      let params = {
        agencyId: "2c938c556d0468d1016d047e39a20019",
        pageNo: "",
        pageSize: ""
      };
      this.$http.post("queryAlarmInfoList", params).then((res) => {
        if (res.data.code == "success") {
          this.list = res.data.data.rows;
        } else {
          console.log(res.data);
        }
      }).catch(function (error) {
        console.log(error);
      })

    },
    toAlarmDetail (id) {
      this.$router.push({ name: 'alarmDetail', params: { id: id } })
    }
  }
};
</script>

<style lang="scss">
@import "@/assets/css/common.scss";
.alarm_wrap {
  .alarm-list {
    width: 88%;
    margin: 15px auto;
    .item {
      position: relative;
      font-size: 0.42rem;
      padding-bottom: 0.3rem;

      .left-block {
        display: flex;
        padding: 5px 0;
        strong {
          margin-right: 10px;
          width: 1.71rem;
          display: inline-block;
          text-align: justify;
          text-align-last: justify;
        }
        .leftCon {
          color: #868686;
          width: 69%;
        }
      }
      &:before {
        position: absolute;
        display: inline-block;
        font: normal normal normal 14px/1 "vant-icon";
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        color: #d6d5d5;
        font-size: 0.5rem;
        content: "\F00A";
        right: 5px;
        top: 50%;
        margin-top: -0.25rem;
      }
      &:after {
        position: absolute;
        box-sizing: border-box;
        content: " ";
        pointer-events: none;
        right: 0;
        bottom: 0;
        left: 0;
        border-bottom: 1px solid #d3d5dc;
        -webkit-transform: scaleY(0.5);
        transform: scaleY(0.5);
      }
    }
  }
}
</style>